<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="./css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="./css/iconfonts.css" />
		<style type="text/css">

			.updatePassword {
				margin: 0rem 0.625rem;
				background-color: #FFFFFF;
			}

			.iconfont {
				font-size: 1.75rem;
				color: #9CB2C2;
			}
			.imgBox{
				/* border: 0.0625rem solid red; */
				float: left;
				margin-top: 0.9375rem;
				margin-left: 1.875rem;
			}
			.update .tips{
				/* border: 0.0625rem solid yellow; */
				display: block;
				margin-left: 1.875rem;
				color: red;
				font-size: 0.9375rem;
			}
			.update input{
				border: 0rem;
				width: 80%;
				margin-top: 0.53125rem;
			}
			#updatePsd{
				margin-top: 0.625rem;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">修改密码</h1>
		</header>
		<div class="mui-content">
			<div class="updatePassword">
				<!-- <div class="update">
					<div class="imgBox">
						<span class="icon iconfont">&#xe602;</span>
					</div>
					<div class="userInfo staff">
						<input id="staffAccount" type="text" placeholder="输入您的账号">
					</div>
				</div> -->
				<div class="update">
					<div class="imgBox">
						<span class="icon iconfont">&#xe60b;</span>
					</div>
					<div class="userInfo mui-password">
						<input id="oldPsd" type="password" class="mui-input-password" placeholder="填写旧密码">
					</div>
				</div>
				<div class="update">
					<div class="imgBox">
						<span class="icon iconfont">&#xe60b;</span>
					</div>
					<div class="userInfo mui-password">
						<input id="newPsd" type="password" class="mui-input-password" placeholder="填写新密码">
					</div>
				</div>
				<div class="update">
					<div class="imgBox">
						<span class="icon iconfont">&#xe60b;</span>
					</div>
					<div class="userInfo mui-password">
						<input id="confirmNewPsd" type="password" class="mui-input-password" placeholder="确认新密码">
					</div>
					<span id="tips" class="tips"></span>
				</div>
				<button id="updatePsd" type="button" class="mui-btn mui-btn-primary mui-btn-block">确认</button>
			</div>
		</div>


		<script src="js/mui.min.js"></script>
		<script src="./js/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<!-- <script src="http://103.59.149.116:6198/hcys/js/mapi.js" type="text/javascript" charset="utf-8"></script> -->
		<script src="js/Mobile.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init()
			$("#updatePsd").click(function() {
				var myStorage = JSON.parse(localStorage.getItem("users"));
				var glbToken = myStorage.glbToken;
				var staffAccount = myStorage.staffid;
				var password = myStorage.password;
				// var staffAccount = $("#staffAccount").val();
				var oldPsd = $("#oldPsd").val();
				var newPsd = $("#newPsd").val();
				
				
				var confirmNewPsd = $("#confirmNewPsd").val();
				if (newPsd != confirmNewPsd) {
					// var tipsValue = document.getElementById("#tips");
					// tipsValue.innerText = "两次密码填写不一致";
					$("#tips").text("两次密码填写不一致");
				} else{
					$("#tips").hide();
					var feedbackInfo = updatePassword(staffAccount, oldPsd, confirmNewPsd, glbToken);
					if (feedbackInfo.status == "ok") {
						alert("修改成功，请退出后重新登录")
					} else{
						alert("修改出错");
					}
				}
			})
		</script>
	</body>

</html>
